<template>
  <div>
    <!--顶部导航-->
    <el-breadcrumb separator-class="el-icon-arrow-right" style="font-size: 16px;">
      <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>病床信息管理</el-breadcrumb-item>
      <el-breadcrumb-item>病床信息添加</el-breadcrumb-item>
    </el-breadcrumb>
    <el-divider></el-divider>

    <!-- 表单 -->
    <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="120px" class="demo-ruleForm">
      <el-form-item label="姓名" prop="name">
        <el-input v-model="ruleForm.name" placeholder="请输入病人名称"></el-input>
      </el-form-item>
      <el-form-item label="年龄" prop="age">
        <el-input v-model="ruleForm.age" placeholder="请输入病人年龄"></el-input>
      </el-form-item>
      <el-form-item label="性别" prop="gender">
        <el-input v-model="ruleForm.gender" placeholder="请输入病人性别"></el-input>
      </el-form-item>
      <el-form-item label="病床号" prop="bed">
        <el-input v-model="ruleForm.bedId" placeholder="请输入病床号"></el-input>
      </el-form-item>
      <el-form-item label="联系方式" prop="phone">
        <el-input v-model="ruleForm.phone" placeholder="请输入病人联系方式"></el-input>
      </el-form-item>
      <el-form-item label="日期：" prop="sort">
        <el-date-picker
            v-model="ruleForm.data">
        </el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="submitForm('ruleForm')">添加</el-button>
        <el-button @click="resetForm('ruleForm')">重置</el-button>
        <el-button type="warning" @click="gotoList">返回列表</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        ruleForm: {
          name:'',
          age:'',
          gender: '',
          bedId: '',
          phone:'',
        },
      // 表单规则
        rules: {

        }
      };
    },
    methods: {
      // 提交表单
      submitForm(formName) {
        this.$refs[formName].validate((valid) => {

        });
      },
      // 重置表单
      resetForm(formName) {
        this.$refs[formName].resetFields();
      }
    }
  }
</script>

<style>
.simple-link {
  color: #409eff;
  text-decoration: underline;
}
</style>